<!DOCTYPE html>

<html>

<head>
    <meta charset="utf-8">
    <title>医院</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="../../layuiadmin/style/admin.css" media="all">
    <link rel="stylesheet" href="//at.alicdn.com/t/font_739294_uu5t1s9dcpj.css" media="all">
    <link rel="stylesheet" href="../../layuiadmin/layui/css/my.css" media="all">


</head>

<body>
    <div class="layui-fluid" id="LAY-component-grid-list">
        <div class="layui-btn-group">
            <button class="layui-btn layui-btn-normal" id='add'><i class="layui-icon">&#xe61f;</i>新增医院部门</button>
            <button class="layui-btn layui-btn-normal" id='ok'><i class="layui-icon">&#xe615;</i>正常状态医院部门</button>
            <button class="layui-btn layui-btn-normal" id='stop'><i class="layui-icon">&#xe615;</i>全部状态医院部门</button> </div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;搜索医院部门：
        <div class="layui-inline">
            <input class="layui-input" name="id" id="demoReload" autocomplete="off" placeholder="请输入医院部门名称">
        </div>
        <div class="layui-btn-group">
            <button class="layui-btn layui-btn-normal" data-type="reload" id="serch"><i class="layui-icon">&#xe615;</i> 搜索</button>
            <button class="layui-btn layui-btn-normal" data-type="reload" id="screen"><i class="iconfont icon-xuanzexiangmu"></i>表头筛选</button>
        </div>
        <table id="demo" lay-filter="test"></table>
    </div>
    <script src="../../layuiadmin/layui/layui.js"></script>
    <script>
        var cols = [
            //表头

            {
                field: 'id',
                title: 'ID',
                width: '10%',
                sort: true,
                show: true,
                event: 'info',
                templet: function(d) {
                    if (d.isdel == 0) {
                        return d.id;
                    } else {
                        return '<span style="color:red">' + d.id + '</span>';
                    }
                },
                align: 'center'
            }, {
                field: 'isdel',
                title: '状态',
                width: '10%',
                templet: function(d) {
                    if (d.isdel == 0) {
                        return '正常';
                    } else {
                        return '<span style="color:red">停用</span>';
                    }
                },
                align: 'center'
            }, {
                field: 'areaname',
                title: '公司名称',
                width: '25%',

                templet: function(d) {
                    if (d.isdel == 0) {
                        return d.areaname;
                    } else {
                        return '<span style="color:red">' + d.areaname + '</span>';
                    }
                }

            }, {
                field: 'bdate',
                title: '开始服务日期',
                width: '15%',
                sort: true,
                templet: function(d) {
                    if (d.isdel == 0) {
                        return d.bdate;
                    } else {
                        return '<span style="color:red">' + d.bdate + '</span>';
                    }
                }

            }, {
                field: 'odate',
                title: '结束服务日期',
                width: '15%',
                templet: function(d) {
                    if (d.isdel == 0) {
                        return "";
                    } else {
                        return '<span style="color:red">' + d.odate + '</span>';
                    }
                }

            }, {
                field: 'memo',
                title: '备注',
                width: '10%',
                templet: function(d) {
                    if (d.isdel == 0) {
                        return d.memo;
                    } else {
                        return '<span style="color:red">' + d.memo + '</span>';
                    }
                }
            }, {
                fixed: 'right',
                title: '操作',
                width: '10%',
                align: 'center',
                toolbar: '#barDemo'
            }

        ];
        layui.config({
            base: '../../layuiadmin/' //静态资源所在路径
        }).extend({
            index: 'lib/index' //主入口模块
        }).use(['index']);

        layui.use('table', function() {
            var table = layui.table;
            var $ = layui.$;

            var tableIns = table.render({
                elem: '#demo',
                height: 'full-90',
                url: '../../../Area/selectex' //数据接口
                    ,
                page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档							
                    limit: 20,
                    limits: [20, 40, 60, 80, 100]

                },
                cols: [cols],
                skin: 'row' //表格风格
                    ,
                even: true
            });

            function editwy(obj) {
                layer.open({
                    type: 2,
                    title: ['编辑医院部门', 'background:#1e9fff;color:white;font-size:17px;font-weight:bold'],
                    content: 'hospitaledit.html',
                    area: ['580px', '420px'],
                    offset: 'auto',
                    maxmin: true,
                    success: function(layero, index) {
                        var body = layer.getChildFrame('body', index);
                        body.find('#areaname').val(obj.areaname);
                        body.find('#bdate').val(obj.bdate);
                        body.find('#memo').val(obj.memo);
                        body.find('#id').val(obj.id)
                    }
                });
            }

            function delwy(obj) {
                layer.open({
                    type: 2,
                    title: ['停用医院部门', 'background:#1e9fff;color:white;font-size:17px;font-weight:bold'],
                    content: 'hospitaldel.html',
                    area: ['580px', '420px'],
                    offset: 'auto',
                    maxmin: true,
                    success: function(layero, index) {
                        var body = layer.getChildFrame('body', index);
                        body.find('#areaname').html(obj.areaname);
                        body.find('#bdate').html(obj.bdate);
                        body.find('#memo').html(obj.memo);
                        body.find('#id').val(obj.id)
                    }
                });
            }
            //监听工具条
            table.on('tool(test)', function(obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
                var data = obj.data; //获得当前行数据
                var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）			 			
                if (data.isdel == 0) {
                    if (layEvent === 'del') { //删除
                        delwy(data);
                    } else if (layEvent === 'edit') { //编辑
                        editwy(data);
                    } else if (obj.event === 'info') {
                        editwy(data);
                    }
                } else {
                    layer.msg('该医院部门已经停用，无法进行操作', {
                        offset: 'auto',
                        icon: 2,
                        time: 1500
                    })
                }
            });

            //查询所有状态
            $("#stop").on('click', function() {
                tableIns.reload({
                    url: '../../../Area/selectexall',
                    where: {} //设定异步数据接口的额外参数
                    ,
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                });
                $("table tr").css({
                    "background": "#1e9fff",
                    "color": "white"
                });
                //console.log($("table th").attr("data-field"))
                console.log(cols[0].field);
            });
            var alos = cols;
            $("#screen").on('click', function() {
                cols = [
                    //表头

                    {
                        field: 'id',
                        title: 'ID',
                        width: '10%',
                        sort: true,
                        show: true,
                        event: 'info',
                        templet: function(d) {
                            if (d.isdel == 0) {
                                return d.id;
                            } else {
                                return '<span style="color:red">' + d.id + '</span>';
                            }
                        },
                        align: 'center'
                    }, {
                        field: 'isdel',
                        title: '状态',
                        width: '10%',
                        templet: function(d) {
                            if (d.isdel == 0) {
                                return '正常';
                            } else {
                                return '<span style="color:red">停用</span>';
                            }
                        },
                        align: 'center'
                    }, {
                        field: 'areaname',
                        title: '公司名称',
                        width: '25%',

                        templet: function(d) {
                            if (d.isdel == 0) {
                                return d.areaname;
                            } else {
                                return '<span style="color:red">' + d.areaname + '</span>';
                            }
                        }

                    }, {
                        field: 'bdate',
                        title: '开始服务日期',
                        width: '15%',
                        sort: true,
                        templet: function(d) {
                            if (d.isdel == 0) {
                                return d.bdate;
                            } else {
                                return '<span style="color:red">' + d.bdate + '</span>';
                            }
                        }

                    }, {
                        field: 'odate',
                        title: '结束服务日期',
                        width: '15%',
                        templet: function(d) {
                            if (d.isdel == 0) {
                                return "";
                            } else {
                                return '<span style="color:red">' + d.odate + '</span>';
                            }
                        }

                    }, {
                        field: 'memo',
                        title: '备注',
                        width: '10%',
                        templet: function(d) {
                            if (d.isdel == 0) {
                                return d.memo;
                            } else {
                                return '<span style="color:red">' + d.memo + '</span>';
                            }
                        }
                    }, {
                        fixed: 'right',
                        title: '操作',
                        width: '10%',
                        align: 'center',
                        toolbar: '#barDemo'
                    }

                ];
                layer.open({
                    type: 2,
                    title: ['表头筛选', 'background:#1e9fff;color:white;font-size:17px;font-weight:bold'],
                    area: ['650px', '200px'],
                    offset: 'auto',
                    content: 'hospitalscreen.html',
                    maxmin: true,
                    btn: ['确认', '取消'],
                    success: function(layero, index) {
                        var body = layer.getChildFrame('body', index);
                        for (var k = 0; k < alos.length; k++) {
                            body.find("#" + alos[k].field).prop("checked", true);
                        }
                    },
                    yes: function(index, layero) {
                        var body = layer.getChildFrame('body', index);
                        var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();

                        var a = iframeWin.a();
                        for (var i = 0; i < a.length; i++) {
                            for (var j = 0; j < cols.length; j++) {
                                if (a[i] == cols[j].field) {

                                    cols.splice(j, 1)
                                }
                            }

                        }
                        alos = cols;
                        tableIns.reload({
                            cols: [cols]

                        });

                        layer.close(index);

                        $("table tr").css({
                            "background": "#1e9fff",
                            "color": "white"
                        });
                    }
                })

            })

            //查询正常状态
            $("#ok").on('click', function() {
                tableIns.reload({
                    url: '../../../Area/selectex',
                    where: {} //设定异步数据接口的额外参数
                    ,
                    page: {
                        curr: 1 //重新从第 1 页开始
                    },
                });

                $("table tr").css({
                    "background": "#1e9fff",
                    "color": "white"
                });
            });
            $("#serch").on('click', function() {
                tableIns.reload({
                    url: '../../../Area/selectex',
                    where: {
                        isdel: 'false',
                        keyword: $("#demoReload").val()
                    } //设定异步数据接口的额外参数
                    ,
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                });
                $("table tr").css({
                    "background": "#1e9fff",
                    "color": "white"
                });
            });

            $("table tr").css({
                "background": "#1e9fff",
                "color": "white"
            });
        });

        layui.use('layer', function() {
            var $ = layui.jquery,
                layer = layui.layer;
            $("#add").on('click', function() {
                layer.open({
                    type: 2,
                    title: ['新增医院部门', 'background:#1e9fff;color:white;font-size:17px;font-weight:bold'],
                    content: 'hospitaladd.html',
                    area: ['580px', '420px'],
                    maxmin: true,
                    offset: 'auto'

                })
            });
        });
    </script>
    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-xs" lay-event="edit"><i class="layui-icon">&#xe642;</i>编辑</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon">&#xe640;</i>停用</a>

    </script>
</body>

</html>